<template>
	<basic-container>
		<avue-crud :option="option" :data="data" :page="page" ref="crud" @search-change="searchChange" @search-reset="searchReset"
		 @current-change="currentChange" @size-change="sizeChange" @row-del="rowDel" @row-update="rowUpdate" @row-save="rowSave"
		 @on-load="onLoad" :span-method="spanMethod">
			<template slot-scope="{row}" slot="downQty">
				<span style="color: red;" v-if="row.toQty != row.downQty">{{row.downQty}}</span>
				<span v-if="row.toQty == row.downQty">{{row.downQty}}</span>
			</template>
			<template slot-scope="{row}" slot="upQty">
				<el-link>
					<el-tag type="info" v-if="row.upQty == row.downQty" @click="tagClick(row)">{{row.upQty}}</el-tag>
					<el-tag v-if="row.upQty != row.downQty" @click="tagClick(row)">{{row.upQty}}</el-tag>
				</el-link>
			</template>
		</avue-crud>
		<el-drawer title="上架详情" size="800px" :visible.sync="drawer" v-if='drawer' :direction="direction" append-to-body
		 :modal-append-to-body='false'>
			<upLog :pid="pid" :bar="bar"></upLog>
		</el-drawer>
	</basic-container>
</template>

<script>
	import request from '@/router/axios';
	import upLog from '../in/upLog.vue'

	export default {
		components: {
			upLog
		},
		data() {
			return {
				drawer: false,
				direction: 'rtl',
				pid: '',
				bar:'',
				query: {},
				page: {
					pageSize: 10,
					currentPage: 1,
					total: 0
				},
				option: {
					searchMenuSpan: 6,
					border: true,
					index: true,
					editBtn: false,
					delBtn: false,
					viewBtn: true,
					addBtn: false,
					menu: false,
					refreshBtn: false,
					excelBtn: true,
					menuWidth: 70,
					showSummary: true,
					sumColumnList: [{
						name: 'quantity',
						type: 'sum'
					}, {
						name: 'toQty',
						type: 'sum'
					}, {
						name: 'downQty',
						type: 'sum'
					}, {
						name: 'upQty',
						type: 'sum'
					}],
					column: [{
							label: "移库单",
							prop: "moveCode",
							search: true,
							searchSpan: 4,
							width: 150
						},
						{
							label: "库位",
							prop: "localCode",
							search: true,
							searchSpan: 4,
							width: 150
						},
						{
							label: "条码",
							prop: "barCode",
							search: true,
							searchSpan: 4,
							width: 150
						},
						{
							label: "库存数量",
							prop: "quantity",
							type: "number",
							align:'right',
							width: 100
						},
						{
							label: "计划移库",
							prop: "toQty",
							type: "number",
							align:'right',
							width: 100
						},
						{
							label: "实际下架",
							prop: "downQty",
							type: "number",
							align:'right',
							slot: true,
							width: 100
						},
						{
							label: "实际上架",
							prop: "upQty",
							type: "number",
							align:'right',
							slot: true,
							width: 100
						},
						{
							label: "备注",
							prop: "remark"
						}
					]
				},
				data: []
			};
		},
		created() {
			// request({
			// 	url: '2/api/WmsStorage/getpages',
			// 	method: 'get',
			// 	params: {
			// 		limit: 0
			// 	}
			// }).then(res => {
			// 	this.findObject(this.option.column, 'storeCode').dicData = res.data.data;
			// });
		},
		methods: {
			tagClick(val) {
				this.pid = val.moveCode
				this.bar = val.barCode
				this.drawer = true
			},
			spanMethod({
				row,
				column,
				rowIndex,
				columnIndex
			}) {
				if (columnIndex === 7) {
					if (row.isSpan) {
						return {
							rowspan: row.rowspan,
							colspan: 1
						}
					} else {
						return {
							rowspan: 0,
							colspan: 0
						}
					}
				}
			},
			rowSave(row, loading, done) {
				request({
					url: '2/api/WmsMoveDetail/add',
					method: 'post',
					data: row
				}).then(() => {
					loading();
					this.onLoad(this.page);
					done();
				}, error => {
					done();
					console.log(error);
				});
			},
			rowUpdate(row, index, loading, done) {
				return request({
					url: '2/api/WmsMoveDetail/edit',
					method: 'post',
					data: row
				}).then(() => {
					loading();
					this.onLoad(this.page);
				}, error => {
					done();
					console.log(error);
				});
			},
			rowDel(row) {
				this.$confirm("确定数据删除?", {
						confirmButtonText: "确定",
						cancelButtonText: "取消",
						type: "warning"
					})
					.then(() => {
						return request({
							url: '2/api/WmsMoveDetail/remove',
							method: 'post',
							params: {
								ids: row.id
							}
						});
					})
					.then(() => {
						this.onLoad(this.page);
					});
			},
			searchReset() {
				this.query = {};
				this.page.currentPage = 1;
				this.onLoad(this.page);
			},
			searchChange(params, done) {
				this.page.currentPage = 1;
				this.query = params;
				this.onLoad(this.page);
				done();
			},
			currentChange(currentPage) {
				this.page.currentPage = currentPage;
			},
			sizeChange(pageSize) {
				this.page.pageSize = pageSize;
			},
			onLoad(page) {
				request({
					url: '2/api/WmsMoveDetail/getPagesByUpLog',
					method: 'get',
					params: {
						key: this.query.barCode == undefined ? '' : this.query.barCode,
						type: this.query.moveCode == undefined ? '' : this.query.moveCode,
						status: this.query.localCode == undefined ? '' : this.query.localCode,
						page: page.currentPage,
						limit: page.pageSize
					}
				}).then(res => {
					const data = res.data
					this.data = data.data;
					this.page.total = data.remark;
				});
			}
		}
	};
</script>

<style>
</style>
